<template>
	<view class="box0">
		<zq-navbar :props="{'navbarTitle':'分栏导航栏'}" @getHeight="getHeight"></zq-navbar>
		<zq-subfield v-model="subfieldIndex1" :list="list1" :props="{position:'fixed',top:navbarHeight}"></zq-subfield>
		<zq-subfield v-model="subfieldIndex2" :list="list2"></zq-subfield>
		<zq-subfield v-model="subfieldIndex3" :list="list3"></zq-subfield>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				navbarHeight:0,
				subfieldIndex1:0,
				subfieldIndex2:1,
				subfieldIndex3:2,
				list1:[
					{name:'测试一'},
					{name:'测试一'},
					{name:'测试一'},
					{name:'测试一'},
				],
				list2:[
					{name:'测试一',dotText:'test'},
					{name:'测试一'},
					{name:'测试一',dotText:'20'},
					{name:'测试一'},
				],
				list3:[
					{name:'测试一',dotText:'test'},
					{name:'测试一',dotIamge:'/static/images/banner.png',dotIamgeWidth:30,dotIamgeHeight:30},
					{name:'测试一',dotText:'20'},
					{name:'测试一',dotIamge:'/static/images/banner.png',dotIamgeWidth:50,dotIamgeHeight:50,dotRight:0,dotTop:25},
				]
			}
		},
		methods:{
			getHeight(height){
				this.navbarHeight = height;
			}
		}
	}
</script>

<style>
</style>
